<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <title>中国平安</title>
  <link rel="stylesheet" href="css/layui.css">
  <link rel="stylesheet" type="text/css" href="css/main.css">
  <script type="text/javascript" src="lay/modules/jquery.min.js"></script>
</head>
<body class="layui-layout-body">

  <div class="layui-carousel" id="test1">
   <div class="layui-box lgin">
    <div class="layui-container max">  

      <div class="layui-row">
        <div class="layui-col-md2 layui-col-xs2 layui-col-md-offset1">
         <img src="images/logo_in.png">
       </div>
       <div class="layui-col-md5 layui-col-xs6 main_ti">
         <text class="con_info">平安云视频中心</text>
       </div>
       <div class="layui-col-md2 layui-col-xs2 layui-col-md-offset1 current_time">
        <div class="layui-col-md5 layui-col-xs6 current">
           <text class="time">20:30</text>
         </div>
         <div class="layui-col-md5 layui-col-xs5 responsed">
           <text class="week">星期天<br></text>
           <text class="date">2017-10-5</text>
         </div>
        
       </div>
     </div>
   </div>
 </div>
 <div carousel-item >
  <div><img src="images/banner1.jpg" class="sde"></div>
  <div><img src="images/banner1.jpg" class="sde"></div>

</div>
</div>
<div class="layui-container max">  
  <div class="layui-row">
    <div class="layui-col-md12 inform">
     <div class="layui-col-md11 layui-col-md-offset1 ">
       <div class="layui-inline">
        <div class="layui-text"><i class="layui-icon">&#xe645;</i>平安银行，全称平安银行股份有限公司，是中国平安保险（集团）股份有限公司控股的一家跨区域经营的股份制商业银行，为中国大陆12家全</div></div>
      </div>

    </div>
    <div class="layui-col-md3 layui-col-xs3 conleft">
     <ul class="layui-nav layui-nav-tree" lay-filter="test">
      <li class="layui-nav-item layui-nav-itemed">
        <a class="" href="javascript:;"><i class="layui-icon firon">&#x1005;</i> 平台优势<i class="layui-icon riron">&#xe602;</i></a>

      </li>
      <li class="layui-nav-item">
        <a href="javascript:;"><i class="layui-icon firon">&#xe60b;</i> 使用指南<i class="layui-icon riron">&#xe602;</i></a>

      </li>
      <li class="layui-nav-item"><a href=""><i class="layui-icon firon">&#xe63a;</i> 服务热线<i class="layui-icon riron">&#xe602;</i></a></li>
      <li class="layui-nav-item active"><a href=""><i class="layui-icon firon">&#xe614;</i> 下载指南<i class="layui-icon riron">&#xe602;</i></a></li>
      <span class="layui-nav-bar" style="top: 272.5px; height: 0px; opacity: 0;"></span></ul>
    </div>
    <div class="layui-col-md9 layui-col-xs9 conright">
     <div class="layui-col-md12 win_pho">
       <div class="layui-col-md6">

        <img src="images/i1.png" class="layui-col-md9 layui-col-md-offset2">
      </div>

      <div class="layui-col-md6">
        <div class="layui-col-md12 ">

          <img src="images/l1.png" class="layui-col-md3 layui-col-md-offset2 rst">
          <img src="images/d2_act.png" class="layui-col-md4 down_btn layui-col-md-offset1 rs">

        </div>
        <hr class="layui-col-md8 layui-col-md-offset2">
        <div class="layui-col-md12 ">

          <img src="images/l1.png" class="layui-col-md3 layui-col-md-offset2 rst">
          <img src="images/d1.png" class="layui-col-md4 down_btn layui-col-md-offset1 rs">

        </div>
      </div>
    </div>

    <div class="layui-col-md12 ios_android">
      <div class="layui-col-md6 down_btn">
        <div class="layui-col-md12 es">       
          <img src="images/f1.png" class="layui-col-md8 layui-col-md-offset2 rst">

        </div>
        <hr class="layui-col-md8 layui-col-md-offset2">
        <div class="layui-col-md12 es">
          <img src="images/f2.png" class="layui-col-md8 layui-col-md-offset2 rst">

        </div>
      </div>

      <div class="layui-col-md6">

        <img src="images/i2.png" class="layui-col-md9 layui-col-md-offset1">
      </div>
    </div>
  </div>
  <div class="layui-col-md12 layui-col-xs12 confoot">
    <div class="layui-col-md2 layui-col-xs4 layui-col-md-offset1  layui-col-xs-offset1">
      <text class="layui-text service">
        服务支持</br>
        永不下线
      </text>

    </div>
    <div class="layui-col-md2 layui-col-xs7  layui-col-md-offset6 layui-col-xs-offset1 contact">
     <div class="layui-col-md12 ctli">
       <img src="images/phone.png">
       <text class="layui-text">0755-2262888转2</text>
     </div>
     <div class="layui-col-md12 ctli">
       <img src="images/mail.png">
       <text class="layui-text">xxx@pingan.com.cn</text>
     </div>
   </div>
 </div>
</div>
<div class="signright">
  <img src="images/logo.png">
</div>

</div>
<script src="js/layui.js"></script>


<script>
//JavaScript代码区域
layui.use('element', function(){
  var element = layui.element;
  
});
</script>
<script>
  layui.use('carousel', function(){
    var carousel = layui.carousel;
  //建造实例
  carousel.render({
    elem: '#test1'
    ,width: '100%' //设置容器宽度
    
    ,arrow: 'none' //始终显示箭头
    //,anim: 'updown' //切换动画方式
  });
});
</script>
<script type="text/javascript">
 function Appendzero (obj) {
          if (obj < 10) return "0" + obj; else return obj;
    }
  $(window).load(function() {
    var h=$(".sde").height();
    $("#test1").css("height",h)
    })
  $(function(){
    
    var weekDay = ["星期天", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"];
    var mydate = new Date();
    var week=weekDay[mydate.getDay()];
    var year=mydate.getFullYear();
    var month=mydate.getMonth();
    var date=mydate.getDate();
    var hour=mydate.getHours(); 
    var minute=mydate.getMinutes();
    var time=hour+":"+Appendzero (minute);
    var t=year+"-"+month+"-"+date
    $(".week").text(week);
    $(".date").text(t);
    $(".time").text(time)
  })
  $(".es").hover(function(){
    var i= $(this).children("img");
    var src=i.attr("src");
    var newsrc = src.split('.');
    newsrc=newsrc[0]+"_act.png";
    i.attr("src",newsrc)
  },function(){
   var i= $(this).children("img");
   var src=i.attr("src");
   var newsrc = src.split('_');
   newsrc=newsrc[0]+".png";
   i.attr("src",newsrc)
   
 });

  $(".rs").hover(function(){
    var i= $(this);
    var src=i.attr("src");
    var newsrc = src.split('.');
    newsrc=newsrc[0]+"_act.png";
    i.attr("src",newsrc)
  },function(){
   var i= $(this);
   var src=i.attr("src");
   var newsrc = src.split('_');
   newsrc=newsrc[0]+".png";
   i.attr("src",newsrc)
   
 });

</script>
</body>
</html>